<template>
  <section>
    <sel-com-dep v-on:get="getListBtn"></sel-com-dep>
    <el-row v-if="currDepartment">
      <el-button size="mini" type="text" @click="addDefineBtn">新建优惠券定义</el-button>
      <el-main style="height: 500px;border:0px solid crimson">
        <define-list :couponDefineList="couponDefineList" v-if="couponDefineList && couponDefineList.length>0" v-on:get="getCouponDefineList"></define-list>
        <span v-else>暂无数据,<el-button size="mini" type="text" @click="addDefineBtn">点击新建</el-button></span>
      </el-main>
      <el-pagination v-show="totalPage>0" style="margin-top:20px;"
                     background
                     layout="prev, pager, next"
                     :page-count="totalPage"
                     @current-change="goPage">
      </el-pagination>
    </el-row>
  </section>
</template>

<script>
  import {mapGetters, mapActions, mapMutations} from 'vuex'
  import Vue from 'vue'//后续添加属性，需要vue联动
  import dateFormater from '@/common/date-formater'
  import errHandler from '@/assets/errHandler'
  import selComDep from '../selComDep'
  import defineList from './defineList'
  export default {
    name: "couponDefine",
    components: {selComDep,defineList},
    data() {
      return {
        totalPage:0,
        couponDefineList:null,
        departmentList:null,
        currDepartment:null,
        defineForm:{
          name:'临时给一个',
          start:'',
          end:'',
          way:null,
          criteria:[],
          totalNum:null,
          price:null,
          data:[],
          edit:true
        },
        shadow:'never'
      }
    },
    created(){
      //获取优惠券定义列表
      // this.getCouponDefineList()
    },
    computed:{
    },
    watch: {
    },
    methods: {
      ...mapActions({
        fetch: 'fetch'
      }),
      goPage(val){
        this.loading=true
        this.getCouponDefineList(val-1)
      },
      getListBtn(e){
        console.log(e)
        this.currDepartment=e
        this.getCouponDefineList()
      },
      getCouponDefineList(pageNo){
        this.fetch({name:"getCouponDefineList",data:{page:pageNo?pageNo:0,departmentId:this.currDepartment.id}})
          .then(res=>{
            console.log(res)
            this.couponDefineList=res.content
            this.totalPage=res.totalPages
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
      addDefineBtn(){
        this.couponDefineList.unshift({...this.defineForm,departmentCode:this.currDepartment.code})
      },
      subDefine(define){
        console.log(define)
      },
      checkCard(define){
        console.log(define)
        if(this.shadow === 'never'){
          this.shadow='always'
        }else {
          this.shadow='never'
        }
      },
      addDataInDefine(define){
        console.log(define)
        define.data.push('')
      }
    }
  }
</script>

<style scoped>

</style>
